<template>
  <div>
    <div v-if="invitation.id > 0">
      <div style="font-size:15px;text-align:center;margin-top:20px;">每邀请一位新用户下单可获得如下邀请礼包</div>
      <div v-for="(item,index) in invitation.gifts" :key="index" class="gift">
        {{item.name}}
      </div>
      <button class="btn" open-type="share">立即邀请</button>
    </div>
    <div v-else style="font-size:15px;text-align:center;margin-top:20px;">活动未开启</div>
  </div>
</template>

<script>
import api from '@/utils/api'
import {
  mapState,
  mapActions,
  mapGetters
} from 'vuex'
export default {
  data() {
    return {
      invitation:{}
    }
  },
  computed: {
    ...mapGetters([
      'user'
    ])
  },
  methods: {
    
  },
  onShareAppMessage: function(options) {
    let data = {
        title: '新人礼包',
        //imageUrl: this.fighting_group.picture_url,
        desc: '新人礼包',
        path: '/pages/user/new_user_gifts?invitation_user_id='+this.user.id
    }
    console.log('data: ', data)
    return data
  },
  async mounted() {
    let result = await api.getInvitation({brand_id:this.user.brand_id,status:'enable'})
    console.log('result=>',result)
    if(result.code == 0){
      this.invitation = result.data
    }
  }
}
</script>

<style>
page{
  background: #EC7676;
  color: #fff;
}
.gift{
  background: #F01E1E;
  width: 90%;
  height: 60px;
  line-height: 60px;
  text-align: center;
  margin: 10px auto 0px auto;
  border-radius: 10px;
  font-size: 16px;
}
.btn {
  height: 40px;
  line-height: 40px;
  width: 80%;
  color: white;
  text-align: center;
  background: #F01E1E;
  border-radius: 50px;
  margin: 20px auto;
  font-size: 16px;
}
</style>